<template>
    <div>
        <Table :show-header="false" :height="height" :columns="columns" :data="weatherData"></Table>
    </div>
</template>

<script>
  export default {
    name: 'temperatureDataTable',
    data() {
      return {
        columns: [
          {
            title: '日期',
            key: 'week',
            width: 80
          },
          {
            title: '温度(℃)',
            key: 'temperature',
            sortable: true,
            width: 120,
            align: "center"
          },
          {
            title: "标识",
            align: "center",
            render: (h, params) => {
              let name = "#icon-yin";
              if (params.row.weather.indexOf("多云") > -1) {
                name = "#icon-tianqitubiao_duoyun"
              }
              if (params.row.weather.indexOf("阴") > -1) {
                name = "#icon-tianqitubiao_duoyun"
              } else if (params.row.weather.indexOf("晴") > -1) {
                name = "#icon-tianqitubiao_qingtianbai"
              } else if (params.row.weather.indexOf("小雨") > -1) {
                name = "#icon-tianqitubiao_xiaoyu"
              } else if (params.row.weather.indexOf("中雨") > -1) {
                name = "#icon-tianqitubiao_zhongyu"
              }
              return h("div", [
                h("svgIcon", {
                  props: {
                    name: name
                  }
                }),
                h('span', {
                  style: {
                    "marginLeft": "5px"
                  }
                })
              ])
            }
          },
          {
            title: "天气",
            key: "weather",
            align: "center",
            render: (h, params) => {
              return h("div", params.row.weather)
            }
          }
        ]
      };
    },
    props: {
      weatherData: Array,
      height: String
    }
  };
</script>
